{% extends "../main.html" %}

{% block head %}
{% endblock %}

{% block breadcrumb %}
<nav>
    <ul id="crumbs">
        <li><a href="/">{{ system_title }}</a></li>
        <li>{{ str.reception }}</li>
    </ul>
</nav>
{% endblock %}

{% block content %}

<div id="content">
    <div id="login" style="margin:10px 0px; float:right;">
        <a id="signup_show" href="javascript:void(0);" class="button" style="">{{ str.application_add_new }}</a>
        <div id="signup_form" style="display:none;">
            {{ str.email }}: <input type="email" id="signup_email" name="signup_email" style="width:200px;" /> <a id="signup_send" href="javascript:void(0);" class="button">{{ str.add }}</a>
        </div>
    </div>

    <div class="table" style="margin-bottom:10px;">
    {% regroup receptions|dictsort:"level" by level as grouped %}
    {% for group in grouped %}
        <div class="table_row" style="padding-top:20px;">
            <div class="header_cell">
                {{ group.grouper }}
            </div>
            <div class="header_cell" style="text-align:center;">
                {{ str.reception_period }}
            </div>
            <div class="header_cell" style="text-align:center;">
                {{ str.reception_application_count }}
            </div>
        </div>
        {% for r in group.list|dictsort:"displayname" %}
        <div class="table_row" alt="{{ r.key }}">
            <div class="table_cell">
                <a href="/reception/{{ r.key.id }}">{{ r.displayname }}</a>
            </div>
            <div class="table_cell" style="text-align:center;">
                {{ r.start_datetime|date:"d.m.Y" }} - {{ r.end_datetime|date:"d.m.Y" }}
            </div>
            <div class="table_cell" style="text-align:center;">
                {{ r.leechers|length }}
            </div>
        </div>
        {% endfor %}
    {% endfor %}
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function(){

        //SIGN UP
        $('#signup_show').click(function() {
            $(this).hide();
            $('#signup_form').show();
            $('#signup_email').focus();
        });

        $('#signup_send').click(function() {
            sendMail();
        });

        $('#signup_email').keyup(function(e) {
            if(e.keyCode == 13) sendMail();
        });

        function sendMail() {
            if($('#signup_email').val()) {
                $.post('/application/signin', { email: $('#signup_email').val(), receptionist: 'receptionist' }, function(data) {
                    if(data) {
                        location.href = '/reception/application/' + data;
                    } else {
                        $('#signup_form').effect("shake", { times:3 }, 90);
                    }
                });
            } else {
                $('#signup_email').focus();
            }
        }

    });
</script>

{% endblock %}